const fs = require("fs")
const path = require("path")
// 1. 正则匹配style标签和script标签
const regStyle = /<style>[\s\S]*<\/style>/
const regScript = /<script>[\s\S]*<\/script>/

// 2. 读取文件，将处理css，js和html三个文件的方法单独抽离，便于维护
fs.readFile(path.join(__dirname, 'index.html'), 'utf8', function(err, data) {
    if (err) return "读取index.html文件失败"
    resolveCss(data)
    resolveJs(data)
    resloveHtml(data)
})

// 2.1 处理css函数
function resolveCss(htmlStr) {
    // 正则实例.exec方法返回符合匹配条件的所有字符
    const res = new RegExp(regStyle).exec(htmlStr)
    if (!res) return "匹配不到结果"
    const cssStr = res[0].replace("<style>", "").replace("</style>", "")
    console.log(cssStr)
    fs.writeFile(path.join(__dirname, 'dist/index.css'), cssStr, function (err) {
        if (err) return "css文件写入失败"
        console.log("css文件写入成功")
    })
}
// 2.2 处理js函数
function resolveJs(htmlStr) {
    const res = new RegExp(regScript).exec(htmlStr)
    if (!res) return "匹配不到结果"
    const jsStr = res[0].replace("<script>", "").replace("</script>", "")
    console.log(jsStr)
    fs.writeFile(path.join(__dirname, 'dist/index.js'), jsStr, function (err) {
        if (err) return "js文件写入失败"
        console.log("js文件写入成功")
    })
}
// 2.3 处理html函数
function resloveHtml(htmlStr) {
    const html = htmlStr.replace(regStyle, '<link rel="stylesheet" href="./index.css"></link>').replace(regScript, '<script src="./index.js"></script>')
    fs.writeFile(path.join(__dirname, 'dist/index.html'), html, function (err) {
        if (err) return "html文件写入失败"
        console.log("html文件写入成功")
    })
}